<template>
  <div>
      </br>
       <Table :border="true" :stripe="true" :show-header="true" :height="950" :data="buyRecordData" :columns="buyRecordTableColumns" :class='{table_nav:istableNav}' size="large"></Table>
          <Page class="bottom-page tab_page" :total="totalBuyPage" :current="crtBuyPage" align="middle"  :page-size="buyPageSize" show-total show-elevator @on-change="onBuyRecordChange" ></Page>
  </div>
</template>
<script>
import {getVO} from '@/common/proto-vo.js'
import {getMyPromoters, addPromoters, addPPromoters, bindUId, getMySellRoomCardRecords, getMyBuyRoomCardRecords, addPromoterRoomCardNum} from '@/api/promoters.js'
import {getUserBindUId, setUserBindUId, getUId, getUserBindUserId, getUserBindUserName} from '@/common/auth'
import {getRoleBaseInfo} from '@/api/game.js'
// import mainIcon from '@/assets/bianfeng/ico_list_05.png'
import logos from '@/assets/bianfeng/logo-s.png'
export default {
  data () {
    return {
      tableData: [],
      myPlayerTableData: [],
      sellRecordData: [],
      buyRecordData: [],
      userList: [],
      pUserList: [],
      crtPage: 1,
      totalPage: 0,
      pageSize: 10,
      crtSellPage: 1,
      totalSellPage: 0,
      sellPageSize: 10,
      crtBuyPage: 1,
      totalBuyPage: 0,
      buyPageSize: 10,
      crtMyPlayerPage: 1,
      totalMyPlayerPage: 0,
      myPlayerPageSize: 10,
      uId: '',
      uid: '',
      pUid: '',
      pUserName: '',
      userName: '',
      tUId: '',
      keyNum: 0,
      tKeyNum: 1,
      selectType: 0,
      addPromotersModal: false,
      bindUserNameModal: false,
      addPPromotersModal: false,
      addPromotersJabeModal: false,
      logos,
      istableNav: true,
      promotersMgrLab: (h) => {
        return h('div', [
          h('Button', [h('Img', {
            props: {
              src: 'logos',
              size: '110',
              color: '#459498'
            },
            style: {
              fontSize: '30px',
              width: '25px',
              height: '100px',
              marginBottom: '30px'
            }
          }), h('Label', {
            style: {
              fontSize: '20px',
              color: '#1881B1',
              width: '10px',
              height: '50px'
            }
          }, '代理首页')], {
            style: {
              width: '100px',
              height: '100px'
            }}
            )
        ])
      },
      myPromotersLab: (h) => {
        return h('div', [
          h('Button', {
            props: {
              type: 'info'
            },
            style: {
              width: '100px',
              height: '50px'
            }
          }, '我的下线')
        ])
      },
      myBuyersLab: (h) => {
        return h('div', [
          h('Button', {
            props: {
              type: 'info'
            },
            style: {
              width: '100px',
              height: '50px'
            }
          }, '我的买家')
        ])
      },
      roomCardBuyRecordLab: (h) => {
        return h('div', [
          h('Button', {
            props: {
              type: 'info'
            },
            style: {
              width: '100px',
              height: '100px',
              background: ''
            }
          }, '购买记录')
        ])
      },
      roomCardSellRecordLab: (h) => {
        return h('div', [
          h('Button', {
            props: {
              type: 'info'
            },
            style: {
              width: '100px',
              height: '100px'
            }
          }, '出售记录')
        ])
      }
    }
  },
  created () {
    // this.mySearch()
    this.onBuySearch()
  },
  methods: {
    mySearch () {
      let bindUId = getUserBindUId()
      let uId = getUId()
      console.log('bindUId:', bindUId, 'uId:', uId)
      if (bindUId > 0) {
        this.onSearch()
      } else {
        this.bindUserNameModal = true
        console.log('this.bindUserNameModal:', this.bindUserNameModal)
      }

      let selfId = getUserBindUserId()
      let selfName = getUserBindUserName()
      getRoleBaseInfo(selfId, selfName).then((data) => {
        if (!data) {
          return
        }
        let RoleBaseInfoVO = getVO('RoleBaseInfoVO')
        let pv = data.data.data
        let vo = RoleBaseInfoVO.decode(pv.data[0])
        this.keyNum = vo.jabe
      })
      // }
    },
    onSearch () {
      console.log('onSearch type:', this.selectType)
      getMyPromoters(this.crtPage, this.pageSize, this.selectType).then((data) => {
        if (!data) {
          return
        }
        let pv = data.data.data
        let len = pv.data.length
        if (this.selectType === 0) {
          this.tableData = []
          let PromotersVO = getVO('PromotersVO')
          for (let i = 0; i < len; i++) {
            let vo = PromotersVO.decode(pv.data[i])
            vo.pUid = vo.pUid.toNumber()
            vo.uid = vo.uid.toNumber()
            vo.lastBuyTime = vo.lastBuyTime.toNumber()
            this.tableData.push(vo)
          }
          this.totalPage = pv.intValues[1]
        } else {
          this.myPlayerTableData = []
          let RoomCardRecordVO = getVO('RoomCardRecordVO')
          for (let i = 0; i < len; i++) {
            let vo = RoomCardRecordVO.decode(pv.data[i])
            vo.id = vo.id.toNumber()
            vo.pUid = vo.pUid.toNumber()
            vo.uid = vo.uid.toNumber()
            vo.lastLoginTime = vo.lastLoginTime.toNumber()
            vo.createTime = vo.createTime.toNumber()
            this.myPlayerTableData.push(vo)
          }
        }
        let pUserName = data.data.data.strValues[0]
        if (pUserName !== '') {
          this.pUserName = pUserName
        }
        console.log('this.tableData:', this.tableData, ',this.becomPromoters:', this.becomPromoters)
      })
    },
    onSellSearch () {
      getMySellRoomCardRecords(this.crtPage, this.pageSize).then((data) => {
        if (!data) {
          return
        }
        this.sellRecordData = []
        let RoomCardRecordVO = getVO('RoomCardRecordVO')
        let pv = data.data.data
        let len = pv.data.length
        for (let i = 0; i < len; i++) {
          let vo = RoomCardRecordVO.decode(pv.data[i])
          vo.id = vo.id.toNumber()
          vo.pUid = vo.pUid.toNumber()
          vo.uid = vo.uid.toNumber()
          vo.lastLoginTime = vo.lastLoginTime.toNumber()
          vo.createTime = vo.createTime.toNumber()
          this.sellRecordData.push(vo)
        }

        this.totalSellPage = pv.intValues[1]
        console.log('this.sellRecordData:', this.sellRecordData)
      })
    },
    onBuySearch () {
      getMyBuyRoomCardRecords(this.crtBuyPage, this.pageSize).then((data) => {
        if (!data) {
          return
        }
        this.buyRecordData = []
        let RoomCardRecordVO = getVO('RoomCardRecordVO')
        let pv = data.data.data
        let len = pv.data.length
        for (let i = 0; i < len; i++) {
          let vo = RoomCardRecordVO.decode(pv.data[i])
          vo.id = vo.id.toNumber()
          vo.pUid = vo.pUid.toNumber()
          vo.uid = vo.uid.toNumber()
          vo.createTime = vo.createTime.toNumber()
          this.buyRecordData.push(vo)
        }
        this.totalBuyPage = pv.intValues[1]
        console.log('this.buyRecordData:', this.buyRecordData)
      })
    },
    onTabChange (name) {
      if (name === 'promotersMgr') {
        this.selectType = 0
        this.mySearch()
      } else if (name === 'roomCardSellRecord') {
        this.onSellSearch()
      } else if (name === 'roomCardBuyRecord') {
        this.onBuySearch()
      }
      // this.$Message.info(name)
    },
    onMyTabChange (name) {
      console.log('onMyTabChange name:', name)
      if (name === 'myPromoters') {
        this.selectType = 0
        this.mySearch()
      } else if (name === 'myBuyers') {
        this.selectType = 1
        this.mySearch()
      }
    },
    onAddPromoters () {
      this.addPromotersModal = true
    },
    onAddPromotersJabe () {
      let selfId = getUserBindUserId()
      let selfName = getUserBindUserName()
      getRoleBaseInfo(selfId, selfName).then((data) => {
        if (!data) {
          return
        }
        let RoleBaseInfoVO = getVO('RoleBaseInfoVO')
        let pv = data.data.data
        let vo = RoleBaseInfoVO.decode(pv.data[0])
        this.keyNum = vo.jabe
      })
      this.addPromotersJabeModal = true
    },
    onBecomePromoters () {
      if (this.pUserName !== '') {
        this.$Message.error('您已经有上线了!!!')
        return
      }
      this.addPPromotersModal = true
    },
    onSubmit () {
      console.log('onSubmit uid:', this.uid)
      if (this.uid === '') {
        this.$Message.error('uid不能为空!!!')
      }
      addPromoters(this.uid).then((data) => {
        if (!data) {
          return
        }
        let success = data.data.data.intValues[0]
        if (success === 1) {
          this.onSearch()
          this.uid = ''
          this.$Message.info('增加推广员成功!!!')
        } else {
          this.$Message.error('增加推广员失败!!!')
        }
      })
    },
    onAddJabeSubmit () {
      let sellNum = parseInt(this.tKeyNum)
      console.log('onAddJabeSubmit tUId=', this.tUId, ',tKeyNum=', sellNum)
      addPromoterRoomCardNum(this.tUId, sellNum).then((data) => {
        let success = data.data.data.intValues[0]
        if (success === 1) {
          this.keyNum = parseInt(this.keyNum) - sellNum
          this.onSearch()
          this.$Message.info('划账成功!!!')
        } else {
          this.$Message.error('划账失败!!!')
        }
      })
    },
    onPSubmit () {
      console.log('onPSubmit uid:', this.pUid)
      if (this.pUid === '') {
        this.$Message.error('uid不能为空!!!')
      }
      addPPromoters(this.pUid).then((data) => {
        let success = data.data.data.intValues[0]
        if (success === 1) {
          this.pUserName = data.data.data.strValues[0]
          this.pUid = ''
          this.$Message.info('成为推广员成功!!!')
        } else {
          this.$Message.error('成为推广员失败!!!')
        }
      })
    },
    onBindSubmit () {
      console.log('onBindSubmit uId:', this.uId)
      if (this.uId === '') {
        this.$Message.error('游戏账号不能为空!!!')
      }
      bindUId(this.uId).then((data) => {
        let success = data.data.data.intValues[0]
        let uId = data.data.data.longValues[0]
        if (success === 1) {
          this.uId = ''
          this.userName = this.userName + ',   数字ID: ' + uId.toNumber()
          setUserBindUId(uId.toNumber())
          window.location.href = '/slotmanager'
          this.$Message.info('绑定账号成功!!!')
        } else {
          this.$Message.error('绑定账号失败!!!')
        }
      })
    },
    onChange (item) {
      console.log(item)
      this.crtPage = item
      this.selectType = 0
      this.onSearch()
    },
    onMyPlayerChange (item) {
      console.log(item)
      this.selectType = 1
      this.crtMyPlayerPage = item
      this.onSearch()
    },
    onSellRecordChange (item) {
      console.log(item)
      this.crtSellPage = item
      this.onSellSearch()
    },
    onBuyRecordChange (item) {
      console.log(item)
      this.crtBuyPage = item
      this.onBuySearch()
    }
  },
  computed: {
    tableColumns () {
      let cols = [
        {
          title: 'ID',
          key: 'uid',
          color: '#1881B1',
          height: '200px'
        },
        {
          title: '账号名',
          key: 'userName'
        },
        {
          title: '剩余房卡',
          key: 'keyNum'
        },
        {
          title: '最后购买时间',
          key: 'lastBuyTime'
        },
        {
          title: '最后购买数量',
          key: 'lastBuyKeyNum'
        }
      ]
      return cols
    },
    myPlayerTableColumns () {
      let cols = [
        {
          title: 'ID',
          key: 'uid'
        },
        {
          title: '账号名',
          key: 'userName'
        },
        {
          title: '剩余房卡',
          key: 'keyNum'
        },
        {
          title: '最后登录时间',
          key: 'lastLoginTime'
        },
        {
          title: '最后购买时间',
          key: 'createTime'
        },
        {
          title: '最后购买数量',
          key: 'buyCardNum'
        }
      ]
      return cols
    },
    sellRecordTableColumns () {
      let cols = [
        {
          title: 'ID',
          key: 'uid'
        },
        {
          title: '账号名',
          key: 'userName'
        },
        {
          title: '剩余房卡',
          key: 'keyNum'
        },
        {
          title: '最后登录时间',
          key: 'lastLoginTime'
        },
        {
          title: '最后购买时间',
          key: 'createTime'
        },
        {
          title: '最后购买数量',
          key: 'buyCardNum'
        }
      ]
      return cols
    },
    buyRecordTableColumns () {
      let cols = [
        {
          title: '上级ID',
          key: 'pUid'
        },
        {
          title: '上级名字',
          key: 'pUserName'
        },
        {
          title: '购买时间',
          key: 'createTime'
        },
        {
          title: '购买数量',
          key: 'buyCardNum'
        }
      ]
      return cols
    }
  }
}
</script>
<style scoped>
.tabs-label {
    width:300;
    height:300;
    font-size: 30px;
    color: #1881B1;
  }
.tabs-btn {
    width:122px;
    height:100px;
    font-size: 35px;
    margin-left: 20px;
    /*color: #1881B1;*/
}
.tabs-btn1 {
   width:180px;
   height:100px;
   font-size: 35px;
   margin-left: 20px;
  /*color: #1881B1;*/
}
.tabs-input {
    width:300;
    height:100;
    font-size: 30px;
    color: #1881B1;
}
.tab_page{
  font-size: 30px;
  color: #1881B1;
}
.ivu-page-options-elevator input{
  top:-5px;
  font-size: 20px;
  color: #1881B1;
}
 .table_nav{
  font-size: 20px;
  color: #1881B1;
}

 .table_nav table{
  font-size: 18px;
  color: #1881B1;
 }
  .table_nav table th{
    font-size: 32px;
    color: #1881B1;
  }
 .table_nav table td{
  font-size: 25px;
  color: #1881B1;
  }
 .ivu-tabs-nav .ivu-tabs-tab button{
    font-size: 30px;
    height: 90px;
    color: #1881B1;
 }
 .add-group label{
  font-size: 45px;
 }
.shouka .ivu-modal{
  width: 100% ! important;
  padding:30px;
  font-size: 50px;
}
.shouka .ivu-modal .ivu-modal-content{
  height: 100%;
}
.shouka .ivu-modal-header-inner{
  font-size: 50px;
  height: 80px;
  line-height: 80px;
}
.shouka .ivu-modal-body label{
  font-size: 50px;
}
.shouka .ivu-modal-body input{
  font-size: 50px;
  border: 1px solid #000;
}
.shouka .ivu-modal-content i{
  display: inline-block;
  height: 50px;
  width: 50px;
}
.shouka .ivu-modal-content i:before{
  display: inline-block;
  height: 50px;
  font-size: 80px;
}
.shouka .ivu-modal-footer span{
  display: inline-block;
  font-size: 35px;
}
</style>
